import React from 'react';
import {List, Button, Toast,} from 'antd-mobile';

import {GetLeaveEnterInfoList,SaveEnter,LeaveEnterRedisDelete} from "../http/Request";

import EntryAddListStyle from '../assets/css/EntryAddList.module.css'

const Item = List.Item;


export default class EntryAddList extends React.Component {
    // eslint-disable-next-line no-useless-constructor
    constructor(props) {
        super(props);
        this.state={
            totalPrice:'',
            list:[]
        }
        // this.deleteEntryItem = this.deleteEntryItem.bind(this)
    }

    EntryAdd = (props) => {
        this.props.history.push({
            pathname: '/EntryAdd'
        })
    };
    //获取总金额
    onChangetotalPrice = (e) => {
        this.setState({
            totalPrice:e.target.value
        })
    }

    showToast() {
        Toast.info('添加成功', 1);
    };

    /**
     * 生命周期
     * */
    componentDidMount() {
        // super.componentDidMount();
        this.GetLeaveEnterInfoList()
    }

    /**
     * 获取--入栏缓存列表
     * */
    GetLeaveEnterInfoList() {
        let params = {
            id: '1001'
        };
        GetLeaveEnterInfoList(params).then(res => {
       
            this.setState({
                list:res.body
            })
        }).catch(err => {

        })
    };
    /**
     * 完成
     * */
    EntryAddDone(){

        let body ={
            orderType:1001,
            amountPrice:parseInt(this.state.totalPrice),
            amountNumber:parseInt(this.state.list.length),
            leaveEnterInfos:this.state.list
        };

        //添加入栏信息
        SaveEnter(body).then(res => {
            console.log(res);
            this.LeaveEnterRedisDelete()
        }).catch(err => {

        })
    }
//删除入栏缓存
    LeaveEnterRedisDelete(){
        console.log('删除缓存')
        let body = {
            id:'1001'
        }
        LeaveEnterRedisDelete(body).then(res => {
            this.GetLeaveEnterInfoList()
            // this.showToast()
        }).catch(err => {

        })
    }


    list(){
        if(this.state.list == null){
            return(
                <div className={EntryAddListStyle.NoData}>
                    暂无数据
                </div>
            )
        }else{
            return(
                <List style={{padding: '0px'}}>
                    {
                        this.state.list.map((data, index) => {
                            return this.AddSlaughterListItem(data, index)
                        })
                    }
                </List>
            )
        }

    }


    /**
     * 列表
     * */
    AddSlaughterListItem = (data, index) => {
        return (
            <Item key={index} className={EntryAddListStyle.item}>
                <div className={EntryAddListStyle.timeBox}>
                    入栏日期：{data.enterTime}
                </div>
                <div className={EntryAddListStyle.contentBox}>
                    <div className={EntryAddListStyle.imgBox}>
                        <img src={data.enterImages} className={EntryAddListStyle.cow_img} alt=""/>
                    </div>
                    <div className={EntryAddListStyle.InfoBox}>

                        <div>
                            体重：{data.enterWeight}kg
                        </div>
                        {/* <div>
                            价格：{data.enterPrice}¥
                        </div> */}
                    </div>
                    <div className={EntryAddListStyle.Options}>
                    {/*<svg onClick={() => this.AddSlaughterDelete(data, index)} t="1617953207670" className={EntryAddListStyle.icon} viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="3819" width="200" height="200"><path d="M519.62 0.00002C415.696002 0.00002 331.110004 82.468018 327.537004 185.820016H85.016008a48.913999 48.913999 0 0 0-48.913999 48.866999 48.913999 48.913999 0 0 0 48.913999 48.865999h54.009999v547.79199c0 102.852998 69.821999 186.843996 155.909997 186.843996h439.199992c86.087998 0 155.909997-83.490998 155.909997-186.843996V284.100014h48.913999a48.913999 48.913999 0 0 0 48.913999-48.889999 48.913999 48.913999 0 0 0-48.913999-48.865999H711.203996A191.559996 191.559996 0 0 0 519.62 0.00002zM412.386002 177.080017c3.549-49.769999 46.627999-88.539998 99.851998-88.539999 53.223999 0 96.327998 38.745999 99.351998 88.539999H412.386002zM300.390004 929.126002c-30.981999 0-65.082999-39.149999-65.082999-95.040998v-546.33999h575.487989v546.83999c0 55.914999-34.077999 95.040998-65.059999 95.040998H300.389004v-0.5z" fill="#D81E06" p-id="3820"></path><path d="M368.116003 796.815004c24.362 0 44.269999-21.67 44.269999-48.818999V469.373011c0-27.147999-19.908-48.818999-44.269999-48.818999-24.338 0-44.269999 21.671-44.269999 48.818999v278.622994c0 27.147999 19.36 48.818999 44.293999 48.818999z m154.933997 0c24.361 0 44.293999-21.67 44.293999-48.818999V469.373011c0-27.147999-19.933-48.818999-44.293999-48.818999-24.338 0-44.269999 21.671-44.269999 48.818999v278.622994c0 27.147999 19.932 48.818999 44.292999 48.818999z m132.809997 0c24.338 0 44.269999-21.67 44.269999-48.818999V469.373011c0-27.147999-19.932-48.818999-44.269999-48.818999s-44.269999 21.671-44.269999 48.818999v278.622994c0 27.147999 19.36 48.818999 44.269999 48.818999z" fill="#D81E06" p-id="3821"></path></svg>*/}
                    
                    </div>
                </div>
            </Item>
        )
    };



    render() {
        return (
                <div className={'main'}>
                    <div className={EntryAddListStyle.topPart}>

                    </div>
                    <div className={EntryAddListStyle.contentPart}>
                        <div className={EntryAddListStyle.middelBox}>
                            <div className={EntryAddListStyle.inputBox}>
                                <label>总金额:</label><input onChange={this.onChangetotalPrice}
                                                          value={this.state.totalPrice} className={EntryAddListStyle.inputMoney} />
                            </div>
                            <div className={EntryAddListStyle.buttonBox}>
                                <Button type="primary" onClick={this.EntryAdd.bind(this)} inline size="small"
                                        style={{marginRight: '10px'}}>新增</Button>
                                {/*<Button style={{marginRight: '10px'}} type="ghost" inline onClick={this.LeaveEnterRedisDelete.bind(this)} size="small">删除缓存</Button>*/}
                                <Button style={{marginRight: '10px'}} type="ghost" inline onClick={this.EntryAddDone.bind(this)} size="small">完成</Button>
                            </div>
                        </div>

                        {this.list()}


                    </div>
                </div>
        )
    }
}
